<!DOCTYPE html>
<!--<html xmlns="http://www.w3.org/1999/xhtml">-->
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title>OSCode ——永不封闭</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- 样式-->
    <link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="/static/css/bootstrap.css">
    <link rel="stylesheet" href="/static/css/bootstrap-responsive.css">
    <link rel="stylesheet" href="/static/css/prettyPhoto.css"/>
    <link rel="stylesheet" href="/static/css/flexslider.css"/>
    <link rel="stylesheet" href="/static/css/custom-styles.css">

    <!--[if lt IE 9]>
    <link rel="stylesheet" href="css/style-ie.css"/>
    <![endif]-->

    <!-- Favicons图标 -->
    <link rel="shortcut icon" href="/static/img/favicon.ico">
    <link rel="apple-touch-icon" href="/static/img/apple-touch-icon.png">
    <link rel="apple-touch-icon" sizes="72x72" href="/static/img/apple-touch-icon-72x72.png">
    <link rel="apple-touch-icon" sizes="114x114" href="/static/img/apple-touch-icon-114x114.png">

    <!-- js -->
    <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
    <script src="/static/js/bootstrap.js"></script>
    <script src="/static/js/jquery.prettyPhoto.js"></script>
    <script src="/static/js/jquery.flexslider.js"></script>
    <script src="/static/js/jquery.custom.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {

            $("#btn-blog-next").click(function () {
                $('#blogCarousel').carousel('next')
            });
            $("#btn-blog-prev").click(function () {
                $('#blogCarousel').carousel('prev')
            });

            $("#btn-client-next").click(function () {
                $('#clientCarousel').carousel('next')
            });
            $("#btn-client-prev").click(function () {
                $('#clientCarousel').carousel('prev')
            });

        });

        $(window).load(function () {

            $('.flexslider').flexslider({
                animation: "slide",
                slideshow: true,
                start: function (slider) {
                    $('body').removeClass('loading');
                }
            });
        });

    </script>


    <style>
        .top10 {
            font-size: 15px;
            padding: 5px;
            color: black;
            display: block;
            margin-left: 10px;
        }
    </style>
</head>

<body>
<div class="color-bar-1"></div>
<div class="color-bar-2 color-bg"></div>


<!-- 中间部分 -->
<div class="container">
    <!-- logo，搜索框，导航栏 -->
    <div class="row header">
        <!-- 左上角图片和logo -->
        <div class="span5 logo" style="width: 250px">
            <h5 style="font-size: 28px">OSCode</h5>
        </div>
        <!-- 导航栏 -->
        <div class="span7 navigation">
            <div class="navbar hidden-phone" style="height: 40px;">
                <ul class="nav">
                    <li class="dropdown">
                        <a class="dropdown-toggle" data-toggle="dropdown" href="#">公告<b
                                class="caret"></b></a>
                        <ul class="dropdown-menu">
                            <li>{% for announcement in annoucements %}
                                <a href="/announcement/{{ announcement.id }}">{{ announcement.a_title }}</a>
                            {% endfor %}</li>
                        </ul>
                    </li>
                    <li><a href="/release">发布项目</a>&nbsp;</li>
                    <li class="dropdown">
                        <a class="dropdown-toggle" data-toggle="dropdown" href="#">浏览项目<b
                                class="caret"></b></a>
                        <ul class="dropdown-menu">
                            <li><a href="/viewprojects-0-0">全部项目</a></li>
                            <li>{% for category in categories %}
                                <a href="/viewprojects-{{ category.id }}-0">{{ category.c_name }}</a>
                            {% endfor %}</li>
                        </ul>
                    </li>
                    {% if uid %}
                        <li class="dropdown">
                            <a class="dropdown-toggle" data-toggle="dropdown">{{ uid }}，欢迎你<b class="caret"></b></a>
                            <ul class="dropdown-menu">
                                <li><a href="/personalcenter-0-0">个人中心</a></li>
                                <li><a href="/editpwd">修改密码</a></li>
                            </ul>
                        </li>
                        <li><a href="/login">退出</a></li>
                    {% else %}
                        <li><a href="/login">登录</a></li>
                    {% endif %}
                </ul>
            </div>
        </div>
    </div>

      <!-- 显示项目 -->
    <div class="row gallery-row"><!-- 项目列表开始 -->
        <div class="span12">
            <h5 class="title-bg">推荐项目
                <a style="float: right;" href="/viewprojects-0-0-0" class="btn btn-mini btn-inverse hidden-phone"
                   type="button">查看全部</a>
            </h5>
            <!-- 网格，全部项目 -->
            <div class="row clearfix no-margin">
                <ul class="gallery-post-grid holder">
                    {% for p in r_list %}
                        <div>
                            <div>
                                <div class="span3 gallery-item" data-id="id-1" data-type="illustration">
                                    <a href="/single/{{ p.id }}">
                                        <img src="{{ p.p_prepic }}" alt="Gallery" width="270px" height="270px">
                                    </a>
                                    <div class="project-details">
                                        <a class="longtext" style="width: 270px;" href="/single/{{ p.id }}">{{ p.p_name }}</a>
                                        <a class="longtext" style="width: 270px;" href="{{ p.p_link }}">{{ p.p_link }}</a>
                                    </div>
                                    <h5 href="#" title=推荐理由：{{ p.p_info }} class="longtext" style="width: 270px">  推荐理由：{{ p.p_info }}</h5>

                                </div>
                            </div>
                        </div>
                    {% endfor %}
                </ul>
            </div>
        </div>
    </div>
    <!-- 中间部分结束 -->

</div>
<!-- 中间部分结束 -->

<!-- 结尾部分 -->
<div class="footer-container" style="background: #384C74">
    <div class="container" >
        <div style="margin-top: 30px" class="row">
            <div class="span12 footer-col footer-sub" style="background:#1B2A4E">
                <div class="row no-margin" >
                    <div class="span6"><span class="left">OSCode</span>
                    </div>
                    <div class="span6">
                            <span class="right">
                            <a href="#">主页</a>&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<a
                                    href="#">页面</a>&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<a
                                    href="#">联系：+86-15244521075</a>
                            </span>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- 尾部结束 -->

<!-- 回到顶端 -->
<div id="toTop" class="hidden-phone hidden-tablet" >回到顶端</div>

</body>
</html>
<script>
  !
  function() {
      function n(n, e, t) {
          return n.getAttribute(e) || t
      }
      function e(n) {
          return document.getElementsByTagName(n)
      }
      function t() {
          var t = e("script"),
          o = t.length,
          i = t[o - 1];
          return {
              l: o,
              z: n(i, "zIndex", -1),
              o: n(i, "opacity", .9),   //透明度
              c: n(i, "color", "#1296DB"),   //颜色
              n: n(i, "count", 99)
          }
      }
      function o() {
          a = m.width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth,
          c = m.height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight
      }
      function i() {
          r.clearRect(0, 0, a, c);
          var n, e, t, o, m, l;
          s.forEach(function(i, x) {
              for (i.x += i.xa, i.y += i.ya, i.xa *= i.x > a || i.x < 0 ? -1 : 1, i.ya *= i.y > c || i.y < 0 ? -1 : 1, r.fillRect(i.x - .5, i.y - .5, 1, 1), e = x + 1; e < u.length; e++) n = u[e],
              null !== n.x && null !== n.y && (o = i.x - n.x, m = i.y - n.y, l = o * o + m * m, l < n.max && (n === y && l >= n.max / 2 && (i.x -= .03 * o, i.y -= .03 * m), t = (n.max - l) / n.max, r.beginPath(), r.lineWidth = t / 2, r.strokeStyle = "rgba(" + d.c + "," + (t + .2) + ")", r.moveTo(i.x, i.y), r.lineTo(n.x, n.y), r.stroke()))
          }),
          x(i)
      }
      var a, c, u, m = document.createElement("canvas"),
      d = t(),
      l = "c_n" + d.l,
      r = m.getContext("2d"),
      x = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame ||
      function(n) {
          window.setTimeout(n, 1e3 / 45)
      },
      w = Math.random,
      y = {
          x: null,
          y: null,
          max: 2e4
      };
      m.id = l,
      m.style.cssText = "position:fixed;top:0;left:0;z-index:" + d.z + ";opacity:" + d.o,
      e("body")[0].appendChild(m),
      o(),
      window.onresize = o,
      window.onmousemove = function(n) {
          n = n || window.event,
          y.x = n.clientX,
          y.y = n.clientY
      },
      window.onmouseout = function() {
          y.x = null,
          y.y = null
      };
      for (var s = [], f = 0; d.n > f; f++) {
          var h = w() * a,
          g = w() * c,
          v = 2 * w() - 1,
          p = 2 * w() - 1;
          s.push({
              x: h,
              y: g,
              xa: v,
              ya: p,
              max: 6e3
          })
      }
      u = s.concat([y]),
      setTimeout(function() {
          i()
      },
      100)
  } ();
  </script>
